import React from 'react';
import { connect } from 'dva';
import { createForm } from 'rc-form';
import { List, Icon, TextareaItem,Toast } from 'antd-mobile';
import styles from './contactService.css';
import CustBtn from '../../../../../../common/buttons/Btn';

const contactService = ({
  phone,
  specialPlane,
  email,
  QQcode,
  onSubmit=()=>{},
  form: { getFieldProps, getFieldsValue, validateFields },

}) => {
  const imgNegative = () =>{
    console.log('imgNegative click')
    document.getElementById("upload").click();
  }


  const btnProps = {
    textValue:'提交',
    onOk(){
      validData();
    },
  }
  const validData = () => {
    validateFields((error, value) => {
      // console.log(error, value);
      if (error) {
        for (var i in error) {
          error[i].errors.map(e => Toast.info(e.message, 1.5))
        }
        return;
      } else if( value.Message.length == 0 ){
        Toast.info('请输入您要咨询的问题', 1.5)
      } else {
        Toast.info('已提交', 1.5)
        onSubmit(value)
      }
      console.log('value', JSON.stringify(value))
    });
  }

  const onRemove = (data) => {
      dispatch({type: 'myFeedback/onRemovePics', payload: data})
    }


  return (
    <div className={styles.container}>
      <div className={styles.itemList}>
        <div className={styles.leftView}>
          联系电话 :
        </div>
        <div className={styles.rightView}>
          <div className={styles.phone}>{phone}</div>
          <div className={styles.specialPlane}>{specialPlane}</div>
        </div>
      </div>
      <div className={styles.itemList}>
        <div className={styles.leftView}>邮箱地址 :</div>
        <div className={styles.rightView}> {email} </div>
      </div>
      <div className={styles.itemList}>
        <div className={styles.leftView}>QQ 号码 :</div>
        <div className={styles.rightView}> {QQcode} </div>
      </div>

      {/* <div className={styles.messageLink}>留言</div>
      <div  className={styles.TextareaItem} >
        <TextareaItem cols={25} rows={8} placeholder="请输入您要咨询的问题"
          {...getFieldProps('Message',{
            rules: [
              { required: true, message: '请输入您要咨询的问题' }
            ]
          })}
        />

      </div> */}
      {/* <div className={styles.btn}>
        <CustBtn {...btnProps}/>
      </div> */}


    </div>
  )
}


contactService.propTypes = {
};

export default createForm()(contactService);
